<template>
    <div id="index">
        <img :src="avatar">
        <img src="http://sc1.hao123img.com/data/b4b0c42717782c10a6f656fd5174bae0_0"/>
        <h1>{{ msg }}</h1>
        <table border="1" style="word-break:break-all; word-wrap:break-word;">
            <tr>
                <td width='30%'>你的名字：</td>
                <td>{{ nickName }}</td>
            </tr>
            <tr>
                <td>id：</td>
                <td>{{ id }}</td>
            </tr>
            <tr>
                <td>emplId：</td>
                <td>{{ emplId }}</td>
            </tr>
            <tr>
                <td>CorpId：</td>
                <td>{{ corpId }}</td>
            </tr>
            <tr>
                <td>isManager：</td>
                <td>{{ isManager }}</td>
            </tr>
        </table>
        <h1>You Are {{ serverId }}</h1>
    </div>
</template>

<script>
    import {OPENAPIHOST} from "../lib/env.js";
    import dingWISDK from "../lib/ding-web.js";
    import axios from 'axios';
    export default {
        name: "Index",
        data() {
            return {
                msg: "Welcome to Your Index.",
                id: "",
                emplId: "",
                nickName: "",
                corpId: "",
                avatar: "",
                isManager: "",
                serverId: ""
            };
        },
        mounted: function () {
            const self = this;
            self.corpId = dingWISDK.getParam("corpId");
            const signRequest = {
                url: OPENAPIHOST + "/api/dingApp/jsApiOAuth",
                params: {
                    corpId: self.corpId,
                    href: location.href
                }
            };
            dingWISDK
                .jsApiOAuth(signRequest)
                .then(function (response) {
                    self.corpId = response.data.retData.corpId;
                    self.getUserId();
                })
                .catch(function (error) {
                    alert("JS API 权限校验失败 error : ", error);
                });
            dingWISDK.authCode(self.corpId).then(function (response) {
                const codeconfig =
                    {
                        url: OPENAPIHOST + '/api/web/login',
                        params: {
                            corpId: self.corpId,
                            code: response.code
                        }
                    };
                axios(codeconfig, 'get userInfo err').then(function (response) {
                    self.getOrgList(response);
                }).catch(function (error) {
                    console.log('userInfo error : ', error)
                })
            }).catch(function (error) {
                console.log("authCode err", error)
            })

        },
        methods: {
            getUserId: function () {
                // 获取userid
                const self = this;
                dd.ready(function () {
                    dd.biz.user.get({
                        corpId: "", // 可选参数，如果不传则使用用户当前企业的corpId。
                        onSuccess: function (info) {
                            self.nickName = info.nickName;
                            self.id = info.id;
                            self.emplId = info.emplId;
                            self.nickName = info.nickName;
                            self.corpId = info.corpId;
                            self.avatar = info.avatar;
                            self.isManager = info.isManager;
                        },
                        onFail: function (err) {
                            console.log("userGet fail: ", err);
                        }
                    });
                });
            },
            getOrgList: function (response) {
                const self = this;
                axios.get(OPENAPIHOST + '/apps/orgList').then(function (response) {
                    console.log('orgList success : ', response);
                    self.serverId = response.data.retData
                }).catch(function (error) {
                    console.log('orgList error : ', error)
                })
            }
        }
    };
</script>

<style lang="scss">
    #app {
        font-family: "Avenir", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-align: center;
        color: #2c3e50;
        margin-top: 60px;
    }

    h1,
    h2 {
        font-weight: normal;
    }

    ul {
        list-style-type: none;
        padding: 0;
    }

    li {
        display: inline-block;
        margin: 0 10px;
    }

    a {
        color: #42b983;
    }
</style>
